// components/addAddress/addAddress.js
import {
  validateMobile
} from '../../common/js/validate.js';
const app = getApp()
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    edit: Boolean,
    addressForm: {
      type: Object,
      value: {
        "id": '',
        "name": "",
        "mobile": "",
        "area_info": "",
        "address": "",
        "area_id": "",
        "city_id": "",
        "province_id": ""
      }
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    type: 'add', // add edit
    showAddAddress: false,
    disabledSubmit: true,
    multiIndex: [0, 0, 0],
    multiArray: [
      [],
      [],
      []
    ],
    init: true,
    provinceName: '',
    cityName: '',
    areaName: ''
  },
  lifetimes: {
    attached: function () {
      // 在组件实例进入页面节点树时执行
    },
    detached: function () {
      // 在组件实例被从页面节点树移除时执行
    },
  },
  /**
   * 组件的方法列表
   */
  methods: {
     /**
     * 父组件调用子组件方法
     */
    _addInit() {
      this.setData({
        type: 'add',
        init: true
      })
    },
     /**
     * 父组件调用子组件方法
     */
    _editInit () {
      this.setData({
        type: 'edit'
      })
    },
    /**
     * 父组件调用子组件方法
     */
    show() {
      this.setData({
        showAddAddress: true,
        name: this.data.addressForm.name,
        mobile: this.data.addressForm.mobile,
        address: this.data.addressForm.address,
        provinceName: this.data.addressForm.area_info.split(' ')[0],
        cityName: this.data.addressForm.area_info.split(' ')[1],
        areaName: this.data.addressForm.area_info.split(' ')[2],
        province_id: this.data.addressForm.province_id,
        city_id: this.data.addressForm.city_id,
        area_id: this.data.addressForm.area_id,
      })
      this.getArea()
      this.updateDisableSubmit()
    },
    hide() {
      this.setData({
        showAddAddress: false
      })
    },
    /**
     * 点击遮罩隐藏
     */
    bindtapPopup (e) {
      const el = e.currentTarget.dataset.el
      if (el === 'popup') {
        this.hide()
      }
    },
    /**
     * 输入事件
     */
    bindinput(e) {
      const name = e.currentTarget.dataset.name
      this.setData({
        [name]: e.detail.value,
        [name + 'Err']: false
      })

      this.updateDisableSubmit()
    },
    updateDisableSubmit() {
      this.setData({
        disabledSubmit: !(this.data.name && this.data.mobile && this.data.address)
      })
    },
    /**
     * 获取省市区数据
     * @param {String} id 上一级id
     * @param {String} index 0 省 1 市 2 区
     */
    getArea(id = '', index = 0) {
      const self = this
      const multiArray = this.data.multiArray
      app.axios({
        url: '/area/' + id,
        success(res) {
          multiArray[index] = res.data
          self.setData({
            multiArray: multiArray,
          })
          // 查询市
          if (!id && index === 0) {
            self.getArea(res.data[0].id, 1)
          }
          // 查询区
          if (id && index === 1) {
            self.getArea(res.data[0].id, 2)
          }

          // 添加地址，初始化省、市、区id  
          if (index === 2 && self.data.init && self.data.type == 'add') {
            self.setData({
              init: false,
              // provinceName: '', // self.data.multiArray[0][0].name,
              // cityName: '', // self.data.multiArray[1][0].name,
              // areaName: '', // self.data.multiArray[2][0].name,
              // province_id: '', // self.data.multiArray[0][0].id,
              // city_id: '', // self.data.multiArray[1][0].id,
              // area_id: '' // self.data.multiArray[2][0].id
              provinceName: self.data.multiArray[0][0].name,
              cityName: self.data.multiArray[1][0].name,
              areaName: self.data.multiArray[2][0].name,
              province_id: self.data.multiArray[0][0].id,
              city_id: self.data.multiArray[1][0].id,
              area_id: self.data.multiArray[2][0].id
            })
          }
        }
      })
    },
    /**
     * value 改变时触发 change 事件，event.detail = {value}
     */
    bindMultiPickerChange(e) {
      this.setData({
        multiIndex: e.detail.value
      })
    },
    /**
     * 列改变时触发
     */
    bindcolumnchange(e) {
      const {
        column,
        value
      } = e.detail
      let multiIndex = this.data.multiIndex
      multiIndex[column] = value
      if (column === 0) {
        multiIndex[1] = 0;
        multiIndex[2] = 0;
        this.setData({
          provinceName: this.data.multiArray[0][value].name,
          province_id: this.data.multiArray[0][value].id
        })
      }
      if (column === 1) {
        multiIndex[2] = 0;
        this.setData({
          cityName: this.data.multiArray[1][value].name,
          city_id: this.data.multiArray[1][value].id
        })
      }
      if (column === 2) {
        this.setData({
          areaName: this.data.multiArray[2][value].name,
          area_id: this.data.multiArray[2][value].id // 
        })
      }
      this.setData({
        multiIndex: multiIndex
      })
      if (column !== 2) {
        let {
          id
        } = this.data.multiArray[column][value]
        this.getArea(id, column + 1)
      }
    },
    /**
     * 添加地址
     */
    addAddress() {
      if (!validateMobile(this)) {
        return
      }

      if (this.data.provinceName === '请选择' || this.data.provinceName === '') {
        app.showMsg('请选择地址')
        return
      }

      const self = this
      const id = this.data.addressForm.id || ''
      const name = this.data.name // 姓名
      const mobile = this.data.mobile // 手机号
      const area_id = this.data.area_id // 地区id
      const city_id = this.data.city_id // 城市id
      const province_id = this.data.province_id // 省份id
      const area_info = `${this.data.provinceName} ${this.data.cityName} ${this.data.areaName}` // 地区内容格式：北京市 北京市 东城区 中间空格隔开
      const address = this.data.address // 详情地址
      app.axios({
        url: self.data.edit ? '/address-add-edit' : '/address',
        method: 'POST',
        data: {
          id: id,
          name: name,
          mobile: mobile,
          area_id: area_id,
          city_id: city_id,
          province_id: province_id,
          area_info: area_info,
          address: address
        },
        success: function (data) {
          self.triggerEvent('confirm') // 告诉父组件更新页面数据
          self.hide() // 隐藏添加地址弹窗
          app.showMsg(data.msg)
        }
      })
    }
  }
})